---
title: Deploy your Astro Site to Google’s Firebase Hosting
description: How to deploy your Astro site to the web using Google’s Firebase Hosting.
type: deploy
i18nReady: true
---
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'

[Firebase Hosting](https://firebase.google.com/products/hosting) is a service provided by Google’s [Firebase](https://firebase.google.com/) app development platform, which can be used to deploy an Astro site. 

See our separate guide for [adding Firebase backend services](/en/guides/backend/google-firebase/) such as databases, authentication, and storage.

## Project Configuration

Your Astro project can be deployed to Firebase as a static site, or as a server-side rendered site (SSR).

### Static Site

Your Astro project is a static site by default. You don’t need any extra configuration to deploy a static Astro site to Firebase.

### Adapter for SSR

To enable SSR in your Astro project and deploy on Firebase add the [Node.js adapter](/en/guides/integrations-guide/node/). 

:::note
Deploying an SSR Astro site to Firebase requires the [Blaze plan](https://firebase.google.com/pricing) or higher.
:::

## How to deploy

1. Install the [Firebase CLI](https://github.com/firebase/firebase-tools). This is a command-line tool that allows you to interact with Firebase from the terminal.

    <PackageManagerTabs>
      <Fragment slot="npm">
      ```shell
      npm install firebase-tools
      ```
      </Fragment>
      <Fragment slot="pnpm">
      ```shell
      pnpm add firebase-tools
      ```
      </Fragment>
      <Fragment slot="yarn">
      ```shell
      yarn add firebase-tools
      ```
      </Fragment>
    </PackageManagerTabs>

2. Authenticate the Firebase CLI with your Google account. This will open a browser window where you can log in to your Google account.

    <PackageManagerTabs>
      <Fragment slot="npm">
      ```shell
      npx firebase login
      ```
      </Fragment>
      <Fragment slot="pnpm">
      ```shell
      pnpm exec firebase login
      ```
      </Fragment>
      <Fragment slot="yarn">
      ```shell
      yarn firebase login
      ```
      </Fragment>
    </PackageManagerTabs>

3. Enable experimental web frameworks support. This is an experimental feature that allows the Firebase CLI to detect and configure your deployment settings for Astro.

    <PackageManagerTabs>
      <Fragment slot="npm">
      ```shell
      npx firebase experiments:enable webframeworks
      ```
      </Fragment>
      <Fragment slot="pnpm">
      ```shell
      pnpm exec firebase experiments:enable webframeworks
      ```
      </Fragment>
      <Fragment slot="yarn">
      ```shell
      yarn firebase experiments:enable webframeworks
      ```
      </Fragment>
    </PackageManagerTabs>

4. Initialize Firebase Hosting in your project. This will create a `firebase.json` and `.firebaserc` file in your project root.

    <PackageManagerTabs>
      <Fragment slot="npm">
      ```shell
      npx firebase init hosting
      ```
      </Fragment>
      <Fragment slot="pnpm">
      ```shell
      pnpm exec firebase init hosting
      ```
      </Fragment>
      <Fragment slot="yarn">
      ```shell
      yarn firebase init hosting
      ```
      </Fragment>
    </PackageManagerTabs>

5. Deploy your site to Firebase Hosting. This will build your Astro site and deploy it to Firebase.

    <PackageManagerTabs>
      <Fragment slot="npm">
      ```shell
      npx firebase deploy --only hosting
      ```
      </Fragment>
      <Fragment slot="pnpm">
      ```shell
      pnpm exec firebase deploy --only hosting
      ```
      </Fragment>
      <Fragment slot="yarn">
      ```shell
      yarn firebase deploy --only hosting
      ```
      </Fragment>
    </PackageManagerTabs>
